<html lang="en">
<head>
<title>LinksConfig</title>

<script type="text/javascript" src="/js/jquery.min.js"></script>
<script type="text/javascript" src="/js/jquery-ui.min.js"></script>
<script type="text/javascript" src="/js/jquery.tmpl.js"></script>
<script type="text/javascript" src="/js/jquery.container.js"></script>

<script type="text/javascript" src="/ui/jquery.ui.widget.js"></script>
<script type="text/javascript" src="/ui/jquery.ui.button.js"></script>
<script type="text/javascript" src="/ui/jquery.effects.blind.js"></script>
<script type="text/javascript" src="/ui/jquery-ui-1.8.13.custom.js"></script>
<script type="text/javascript" src="/js/jquery.editinplace.js"></script>
<script type="text/javascript" src="/js/jquery.cookie.js"></script>
<script type="text/javascript" src="/js/jquery.dataTables.min.js"></script>
<script type="text/javascript" src="/js/jquery.jeditable.js"></script>
<script type="text/javascript" src="/js/jquery.getQueryParam.1.0.0.full_.js"></script>
<script type="text/javascript" src="/js/json.js"></script>
<script type="text/javascript" src="/js/hotel-bookings.js"></script>

<link type="text/css" rel="stylesheet" href="/css/style.css">
<script>

var theme = jQuery.cookie('uitheme');
if (theme == null || theme == "") {
	theme = "ui-lightness";
}
blankHtml = "/blank.html";
document.write('<link type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.13/themes/'+theme+'/jquery-ui.css" rel="stylesheet" />');
function getInputField(fieldName, fieldVal, id) {
	return '<input type=text class="'+id+'" id="'+fieldName+'" name="'+fieldName+'" value="'+fieldVal+'" size="15">';
}
$().ready(function() {

	$("button,a.button", "").button();
	$("a.button").live("click", function(){  
		var keyVal  = $(this).attr("key");
		var action  = $(this).attr("action");
		if (action == "update") {
			linkconfig = createObjectFromData(keyVal);
		} else {
			linkconfig = {};
		}	
		linkconfig.key=keyVal;
		submitJsonRest(linkconfig, "linkconfig", action, function(data) {
			document.location.href = document.location.href;
		});
		return false;
	});
	$('#linksDataTable').dataTable( {
		"aoColumns": [ 
		{ "bVisible": false },
		{ "bSortable": true },
		{
			"fnRender": function ( oObj ) {
				return getInputField("name", oObj.aData[1], oObj.aData[0]);
			}
		},
		{
			"fnRender": function ( oObj ) {
				iconPath = oObj.aData[4];
				if (iconPath != null && iconPath != "") {
					return "<img src='" + iconPath + "' height=15 width=15>";
				} else {
					return "";
				}
			}
		},
		{
			"fnRender": function ( oObj ) {
				return getInputField("iconPath", oObj.aData[4], oObj.aData[0]);
			}
		},
		{
			"fnRender": function ( oObj ) {
				return getInputField("searchText", oObj.aData[5], oObj.aData[0]);
			}
		},
		{
			"fnRender": function ( oObj ) {
				return getInputField("homepage", oObj.aData[6], oObj.aData[0]);
			}
		},
		{
			"fnRender": function ( oObj ) {
				return getInputField("customSearchID", oObj.aData[7], oObj.aData[0]);
			}
		},
		{
			"fnRender": function ( oObj ) {
				return getInputField("forwardDateFormat", oObj.aData[8], oObj.aData[0]);
			}
		},
		{
			"fnRender": function ( oObj ) {
				return '<td><small><a href="" action="update" class="button" key="'+oObj.aData[0]+'">Update</a></small></td>';
			}
		},
		{
			"fnRender": function ( oObj ) {
				return '<td><small><a href="" action="delete" class="button" key="'+oObj.aData[0]+'">Delete</a></small></td>';
			}
		}
		],
	        "aaSorting": [[ 1, "asc" ]],
	       	"bPaginate": false,
        	"bLengthChange": false,
        	"bFilter": true,
        	"bSort": true,
        	"bInfo": false,
        	"bAutoWidth": true,
     	 	"bJQueryUI": true
 	} );

	submitJsonRest({}, "linkconfig", "get", function(data) {
 		$.each(data, function(key, val) {
			var rowData  =  [
				val.key, 
				val.name, 
				val.name,
				"",
				val.iconPath,
				val.searchText,
				val.homepage, 
				val.customSearchID,
				(val.forwardDateFormat == null) ? "" : val.forwardDateFormat, 
				"",
				""];
			$("#linksDataTable").dataTable().fnAddData(rowData);
			$("a.button", "").button();
	  	});
	});

	$('#create').click(function() {
		submitJsonRest(createObjectFromData("new"), "linkconfig", "create", function(data) {
			document.location.href = document.location.href;
		});
	});

});

function createObjectFromData(key) {
	var $inputs = $('.'+key);
	var linkConfig = {};
    	$inputs.each(function() {
       		createVal = $(this).val();
		if(createVal != null) {
			linkConfig[this.id] = createVal;
		}
	});
	return linkConfig;
}

</script>
</head>
<body>
<br>
<font class="title">Admin - Hotel Search Link Configuration</font><br>
<br>
<div style="overflow: auto;height:70%">
<table id="linksDataTable">
	<thead>
	<tr>
		<th>ID</th>
		<th>Name</th>
		<th>Name</th>
		<th>&nbsp;</th>
		<th>IconPath</th>
		<th>Google<br>SearchText</th>
		<th>Homepage</th>
		<th>Google<br>CustomSearchID</th>
		<th>Forward Link<br>Date Format</th>
		<th>Action</th>
		<th>Action</th>
	</tr>
	</thead>
	<tbody></tbody>
	<tfoot>
	<tr>
		<td>&nbsp;</td>
		<td>NEW</td>
		<td><input type="text" class="new" id="name" name="name" value=""></td>
		<td>&nbsp;</td>
		<td><input type="text" class="new" id="iconPath" value=""></td>
		<td><input type="text" class="new" id="searchText" value=""></td>
		<td><input type="text" class="new" id="homepage" value=""></td>
		<td><input type="text" class="new" id="customSearchID" value=""></td>
		<td><input type="text" class="new" id="forwardDateFormat" value=""></td>
		<td>
			<small><button id="create" key="create">Create</button></small>
		</td>
		<td>&nbsp;</td>
	</tr>
	</tfoot>
</table>
</div>
</body>
</html>
